Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

PROD-2323 Add-tabs-to-display-monitored-and-ignored-schema-in-Data-Detection #5236

Conversation

lucanovera
Copy link
Contributor

@lucanovera lucanovera commented Aug 27, 2024

Description Of Changes

In Data Detection, add tabs to display Monited, Ignored Schema and Action Required.

Code Changes

  • Added DetectionResultFilterTabs.tsx as a simple wrapper with styling changes for DataTabsHeader
  • Added tabs to Data Detection & Discovery Page
  • Added useDetectionResultsFilterTabs.tsx and useDiscoveryResultsFilterTabs.tsx, here I defined the tabs with their resulting diffStatus and childDiffStatus filtering.
  • Use changeTypeOverride prop to override the status icon and status column value to match the current tab (when viewing monitored tab everything should say monitored)
  • Removed confusing eye icon for monitor/unmonitored

Screenshots

Data Detection > Action Required Tab
Screen Shot 2024-08-28 at 10 49 14

Data Detection > Monitored Tab
Screen Shot 2024-08-28 at 10 49 20

Data Detection > Unmonitored Tab
Screen Shot 2024-08-28 at 10 49 23

Data Discovery > Action Required Tab
Screen Shot 2024-08-28 at 10 49 27

Data Discovery > Unmonitored Tab
Screen Shot 2024-08-28 at 10 49 40

Steps to Confirm

  • Go to the Data Detection page

  • Check that using the Monitored tab it displays the Monitored status items only and that the icon for the changeType is monitored (green dot). Also the status column should read Monitored and the action column show only have the Ignore button.

  • Check that using the Unmonitored tab it displays the Unmonitored status items only and that the icon for the changeType is unmonitored (red dot). Also the status column should read Unmonitored and the action column show only have the Monitor button.

  • Check that you can navigate up and down the datasets while keeping the tab filter the same

  • Go to the Data Disocvery page

  • Check that using the Unmonitored tab it displays the Unmonitored status items only and that the icon for the changeType is unmonitored (red dot). Also the status column should read Unmonitored and the action column show no actions (decided best not to try to add this now, since there's a new UI version of DnD coming soon that solves these problems)

  • Check that you can navigate up and down the datasets while keeping the tab filter the same

Pre-Merge Checklist

  • All CI Pipelines Succeeded
  • Issue Requirements are Met
  • Relevant Follow-Up Issues Created
  • Update CHANGELOG.md

Lucano Vera added 12 commits August 22, 2024 13:57
…s-to-display-monitored-and-ignored-schema-in-Data-Detection
…tion-Discovery-Breadcrumbs' of github.com:ethyca/fides into PROD-2323-Add-tabs-to-display-monitored-and-ignored-schema-in-Data-Detection
…ema-in-Data-Detection' of github.com:ethyca/fides into PROD-2323-Add-tabs-to-display-monitored-and-ignored-schema-in-Data-Detection
Copy link

vercel bot commented Aug 27, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
fides-plus-nightly ✅ Ready (Inspect) Visit Preview 💬 Add feedback Aug 28, 2024 5:24pm

Copy link

cypress bot commented Aug 28, 2024

fides    Run #9717

Run Properties:  status check passed Passed #9717  •  git commit e69a77f928 ℹ️: Merge 1c7e59dfb80376319e118db0ba9db0a31050696b into edb36c77d0585185863d565ec7f6...
Project fides
Branch Review refs/pull/5236/merge
Run status status check passed Passed #9717
Run duration 00m 37s
Commit git commit e69a77f928 ℹ️: Merge 1c7e59dfb80376319e118db0ba9db0a31050696b into edb36c77d0585185863d565ec7f6...
Committer Lucano Vera
View all properties for this run ↗︎

Test results
Tests that failed  Failures 0
Tests that were flaky  Flaky 0
Tests that did not run due to a developer annotating a test with .skip  Pending 0
Tests that did not run due to a failure in a mocha hook  Skipped 0
Tests that passed  Passing 4
⚠️ You've recorded test results over your free plan limit.
Upgrade your plan to view test results.
View all changes introduced in this branch ↗︎

@gilluminate
Copy link
Contributor

At 1280 wide, these buttons get squished. Likely not caused by your work here, but something to address while we're here maybe?

CleanShot 2024-08-28 at 09 44 52@2x

@lucanovera
Copy link
Contributor Author

lucanovera commented Aug 28, 2024

At 1280 wide, these buttons get squished. Likely not caused by your work here, but something to address while we're here maybe?

At 1280 wide, these buttons get squished. Likely not caused by your work here, but something to address while we're here maybe?

CleanShot 2024-08-28 at 09 44 52@2x

Good catch. I just pushed a change adding a column width of 180 for the action column. It shouldn't shrink past that now.

Screen Shot 2024-08-28 at 12 55 09

Copy link
Contributor

@gilluminate gilluminate left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great, overall. Just some minor clean up and possibly looking into that button issue.

CHANGELOG.md Outdated
@@ -20,6 +20,9 @@ The types of changes are:
### Added
- Added Gzip Middleware for responses [#5225](https://github.com/ethyca/fides/pull/5225)
- Adding source and submitted_by fields to privacy requests (Fidesplus) [#5206](https://github.com/ethyca/fides/pull/5206)
- Added Action Required / Monitored / Unmonitored tabs to Data Detection page [#5236](https://github.com/ethyca/fides/pull/5236)
- Added Action Required / Unmonitored tabs to Data Discovery page [#5236](https://github.com/ethyca/fides/pull/5236)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this second line can likely be removed as redundant?

initialFilterTabIndex: router.query?.filterTabIndex
? Number(router.query?.filterTabIndex)
: undefined,
});
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 love the clean up

@lucanovera lucanovera merged commit 50995c7 into main Aug 28, 2024
10 of 11 checks passed
@lucanovera lucanovera deleted the PROD-2323-Add-tabs-to-display-monitored-and-ignored-schema-in-Data-Detection branch August 28, 2024 17:20
Copy link

cypress bot commented Aug 28, 2024

fides    Run #9718

Run Properties:  status check passed Passed #9718  •  git commit 50995c7ed6: PROD-2323 Add-tabs-to-display-monitored-and-ignored-schema-in-Data-Detection (#5...
Project fides
Branch Review main
Run status status check passed Passed #9718
Run duration 00m 37s
Commit git commit 50995c7ed6: PROD-2323 Add-tabs-to-display-monitored-and-ignored-schema-in-Data-Detection (#5...
Committer Lucano Vera
View all properties for this run ↗︎

Test results
Tests that failed  Failures 0
Tests that were flaky  Flaky 0
Tests that did not run due to a developer annotating a test with .skip  Pending 0
Tests that did not run due to a failure in a mocha hook  Skipped 0
Tests that passed  Passing 4
⚠️ You've recorded test results over your free plan limit.
Upgrade your plan to view test results.
View all changes introduced in this branch ↗︎

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants